
<template lang="pug">
bwt-drawer.scene-edit(
  :visible="props.modelValue"
  :title="title"
  :loading="loading"
  :close="onClose"
  :closeOnPressEscape="false"
  width="35%"
  @cancel="close"
  @confirm="submit"
)
  bwt-form(
    ref="form"
    :model="model"
    :items="items"
    labelWidth="100px"
  )
</template>

<script setup name="Scene">
// import {
//   getSceneDetailApi,
//   addSceneApi,
//   searchUploadStatusApi,
//   modifySceneApi
// } from '@/api/manage/scene';
import { getStationListApi } from '@/api/base'
import editForm from './edit-form.jsx';
import { ElLoading, ElMessage } from 'element-plus';
const { proxy } = getCurrentInstance();
const emit = defineEmits();
const props = defineProps({
  modelValue: {
    type: Boolean,
    default: false
  },
  data: {
    type: Object,
    default: () => (null)
  },
  text: {
    type: String,
    default: ''
  },
  lines: {
    type: Array,
    default: () => ([])
  }
});
var submitLoading;
const title = computed(() => {
  return props.data ? `修改${props.text}` : `新增${props.text}`
})
const loading = ref(false);
const lineList = toRef(props, 'lines');
const stationList = ref([])
const model = ref({});
const items = editForm({
  uploadSuccess,
  lineList,
  stationList,
  getStationList
});
const form = ref(null);
watch(() => props.modelValue, (newValue, oldValue) => {
  newValue && resetFields()
})

function resetFields() {
  nextTick(() => {
    if (!form) return
    form.value.resetFields()
    getData()
  })
}

function getData() {
  if (props.data) {
    getStationList()
    model.value = {
      ...props.data
    }
    // getSceneDetailApi({
    //   scene_id: props.data.scene_id
    // }).then(rsp => {
    //   model.value = {
    //     ...rsp
    //   }
    // })
  }
}

function uploadSuccess(fileInfo) {
  model.value.file_id = fileInfo.file_id
}

function onClose() {}
function close() {
  emit('update:modelValue', false)
}
function submit() {
  form.value.validate((valid) => {
    if (!valid) return false;
    submitLoading = ElLoading.service({
      lock: true,
      text: '正在场景导入中...',
      spinner: 'el-icon-loading',
      background: 'rgba(0, 0, 0, 0.7)'
    })
    props.data ? modify() : add()
  })
}
function modify() {
  // modifySceneApi(model.value)
  //   .then(rsp => {
  //     searchSceneStatus({
  //       task_id: rsp.task_id,
  //       scene_id: rsp.scene_id
  //     })
  //   })
  //   .catch(() => {
  //     submitLoading.close()
  //   })
}
function add() {
  // addSceneApi(model.value)
  //   .then(rsp => {
  //     searchSceneStatus({
  //       task_id: rsp.task_id,
  //       scene_id: rsp.scene_id
  //     })
  //   })
  //   .catch(() => {
  //     submitLoading.close()
  //   })
}
function searchSceneStatus(params) {
  // searchUploadStatusApi(params)
  //   .then(rsp => {
  //     const { task_status, task_msg } = rsp || {}
  //     if (task_status === 'SUCCESS') {
  //       // 导入成功
  //       submitLoading.close()
  //       ElMessage.success('导入成功')
  //       confirm()
  //     } else if (task_status === 'FAIL') {
  //       submitLoading.close()
  //       ElMessage.error(task_msg)
  //     } else if (task_status === 'PROCESSING') {
  //       const timer = setTimeout(() => {
  //         searchSceneStatus(params)
  //         clearTimeout(timer)
  //       }, 2000)
  //     }
  //   })
  //   .catch(() => {
  //     submitLoading.close()
  //   })
}
function confirm() {
  emit('update:modelValue', false)
  emit('confirm')
}

function getStationList() {
  model.value.station_id = ''
  getStationListApi({
    line_id: model.value.line_id
  }).then(rsp => {
    stationList.value = rsp || []
  })
}

defineExpose({
})
</script>

<style lang="scss" scope>
.scene-edit {
  .el-select {
    width: 100%;
  }
  .bwt-file-upload {
    width: 100%;
  }
}
</style>
